function indexRefresh() {
  indexJs(function () {});
}
setInterval(indexRefresh, 5000);
function indexJs(fn) {
  // // 方法
  function thatDae(str) {
    let reslut = dayjs(str, "MMDD").valueOf();
    let thatdate = dayjs(reslut).format("MM-DD");
    return thatdate;
  }
  function thatDaey(str) {
    let reslut = dayjs(str, "YYYYMM").valueOf();
    let thatdate = dayjs(reslut).format("YYYY-MM");
    return thatdate;
  }
  // 客运线路强度图表
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/getPassengerTransportIntensityInfo",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          plantCap = data.data.ptiMap.ptiList;
          $(".keyun_average").text(data.data.ptiMap.lineAverage.toFixed(2));
          if (plantCap.length !== 0) {
            keyunChart();
          } else {
            $("#keyun_chart").html("<div class='noData'>今日暂无数据</div>");
          }
        } else {
          $("#keyun_chart").html("<div class='noData'>今日暂无数据</div>");
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  //线路平均运距
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/totalAvgline",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          totalAvglineData = data.data.datas;
          $(".line_average").text(data.data.land);
          if (totalAvglineData.length !== 0) {
            dataListlineID = totalAvglineData.map((v) => v.lineID);
            dataListavgline = totalAvglineData.map((v) => v.avgline);
            lineChart();
          } else {
            $("#line_chart").html("<div class='noData'>今日暂无数据</div>");
          }
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  //施工兑现率图表
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/cshRate",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        cshRateData = data.data;
        if (Object.keys(cshRateData).length !== 0) {
          $(".shigong_duixian_max").text(
            (cshRateData.max * 100).toFixed(2) + "%"
          );
          if (cshRateData.length !== 0) {
            majorSet = cshRateData.majorSet;
            mthSet = cshRateData.mthSet.map((v) => thatDaey(v));
            resv_data = cshRateData.resv_data.map((v) => (v * 100).toFixed(2));
            trk_data = cshRateData.trk_data.map((v) => (v * 100).toFixed(2));
            statn_data = cshRateData.statn_data.map((v) =>
              (v * 100).toFixed(2)
            );
            pak_data = cshRateData.statn_data.map((v) => (v * 100).toFixed(2));
            shigongDChart();
          } else {
            $("#shigongDChart").html("<div class='noData'>今日暂无数据</div>");
          }
          if (data.data.max == 0) {
            data.data = [];
          }
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  // 计划施工工时利用率;
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/utznRate",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          $(".shigong_plan_max").text((data.data.max * 100).toFixed(2) + "%");
          majorSetU = data.data.majorSet;
          if (majorSetU.length !== 0) {
            mthSetU = data.data.mthSet.map((v) => thatDaey(v));
            resv_dataU = data.data.resv_data.map((v) => (v * 100).toFixed(2));
            trk_dataU = data.data.trk_data.map((v) => (v * 100).toFixed(2));
            statn_dataU = data.data.statn_data.map((v) => (v * 100).toFixed(2));
            pak_dataU = data.data.statn_data.map((v) => (v * 100).toFixed(2));
            shigongPChart();
          } else {
            $("#shigongPChart").html("<div class='noData'>今日暂无数据</div>");
          }
          if (data.data.max == 0) {
            data.data = [];
          }
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  // 施工变更率;
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/chgRate",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          $(".shigong_change_max").text((data.data.max * 100).toFixed(2) + "%");
          majorSetC = data.data.majorSet;
          if (majorSetC.length !== 0) {
            mthSetC = data.data.mthSet.map((v) => thatDaey(v));
            resv_dataC = data.data.resv_data.map((v) => (v * 100).toFixed(2));
            trk_dataC = data.data.trk_data.map((v) => (v * 100).toFixed(2));
            statn_dataC = data.data.statn_data.map((v) => (v * 100).toFixed(2));
            pak_dataC = data.data.statn_data.map((v) => (v * 100).toFixed(2));
            shigongCChart();
          } else {
            $("#shigongCChart").html("<div class='noData'>今日暂无数据</div>");
          }

          if (data.data.max == 0) {
            data.data = [];
          }
        } else {
          $("#shigongCChart").html("<div class='noData'>今日暂无数据</div>");
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });

  // 运管票务收入
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/tcktRvn",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          echartData = data.data.datas;
          $(".change_average").text((data.data.last / 10000).toFixed(2));
          if (echartData.length !== 0) {
            changeChart();
          } else {
            $("#changeChart").html("<div class='noData'>今日暂无数据</div>");
          }
        } else {
          $("#changeChart").html("<div class='noData'>今日暂无数据</div>");
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  var zhengdianHtml = "";
  $(".zhengdian_box").html();
  // 运管正点率
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/tmRate",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          zhengdianRateData = data.data.datas;
          $(".zhengdian_average").text((data.data.avg * 100).toFixed(2) + "%");

          if (zhengdianRateData.length !== 0) {
            var zhengdianHtml = "";
            for (let i = 0; i < zhengdianRateData.length; i++) {
              const element = zhengdianRateData[i];
              zhengdianHtml +=
                "<div class='zhengdian_every'><p class='zhengdian_num'>" +
                (element.tmMthlyRate * 100).toFixed(2) +
                "%" +
                "</p><p class='zhengdian_line'>" +
                element.lnId +
                "号线" +
                "</p></div>";
              $(".zhengdian_box").html(zhengdianHtml);
            }
          } else {
            $(".zhengdian_box").html("<div class='noData'>今日暂无数据</div>");
          }
        } else {
          $(".zhengdian_box").html("<div class='noData'>今日暂无数据</div>");
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  // 运管兑现率
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/flflmRate",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          duixianRateData = data.data.datas;
          $(".duixian_average").text((data.data.avg * 100).toFixed(2) + "%");
          var zhengdianHtml = "";
          if (duixianRateData.length !== 0) {
            for (let i = 0; i < duixianRateData.length; i++) {
              const element = duixianRateData[i];
              zhengdianHtml +=
                "<div class='duixian_every'><p class='duixian_num'>" +
                (element.flflmMthlyRata * 100).toFixed(2) +
                "%" +
                "</p><p class='duixian_line'>" +
                element.lnId +
                "号线" +
                "</p></div>";
              $(".duixian_box").html(zhengdianHtml);
            }
          } else {
            $("#duixian_box").html("<div class='noData'>今日暂无数据</div>");
          }
        } else {
          $("#duixian_box").html("<div class='noData'>今日暂无数据</div>");
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  // 五分钟延误频次
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/trnKm",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          trnKmData = data.data.datas;
          $(".yanwu_average").text((data.data.min / 10000).toFixed(2));
          if (trnKmData.length !== 0) {
            dataListlnNm = trnKmData.map((v) => v.lnNm);
            dataListkm = trnKmData.map((v) => (v.km / 10000).toFixed(2));
            yanwuChart();
          } else {
            $("#yanwu_chart").html("<div class='noData'>今日暂无数据</div>");
          }
        } else {
          $("#yanwu_chart").html("<div class='noData'>今日暂无数据</div>");
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  // 进度完成情况;
  $.ajax({
    type: "get",
    async: true, //异步执行
    url: base_url + "/planPercent",
    dataType: "json", //返回数据形式为json
    success: function (data) {
      if (data.code == 1000) {
        if (Object.keys(data.data).length !== 0) {
          planPercentData = data.data.datas;
          $(".jindu_average").text(data.data.avg + "%");
          if (planPercentData.length !== 0) {
            planPercentindxNmDtl = planPercentData.map((v) => v.indxNmDtl);
            planPercentindxVl4 = planPercentData.map((v) => v.indxVl4);
            planPercentindxindxVl1 = planPercentData.map((v) => v.indxVl1);
            planPercentindxVl2 = planPercentData.map((v) => v.indxVl2);
            jinduChart();
          } else {
            $(".jinduChart").html("<div class='noData'>今日暂无数据</div>");
          }
        } else {
          $(".jinduChart").html("<div class='noData'>今日暂无数据</div>");
        }
      } else {
        alert(data.message);
      }
      fn();
    },
    error: function (errorMsg) {
      console.log("请求数据失败");
    },
  });
  zhiliangChart();
  touziChart();
}
indexJs(function () {});
// 客运线路强度图表
// keyunChart();
function keyunChart() {
  let keyunC = document.getElementsByClassName("keyun_chart");
  for (var i = 0; i < keyunC.length; i++) {
    let myChart = echarts.init(keyunC[i]);
    let datalist = [
      {
        offset: [50, 50],
        symbolSize: 80,
        opacity: 0.95,
        color: "rgba(104,184,55, 1)",
      },
      {
        offset: [20, 50],
        symbolSize: 70,
        opacity: 0.84,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [80, 20],
        symbolSize: 35,
        opacity: 0.8,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [36, 20],
        symbolSize: 65,
        opacity: 0.75,
        color: "rgba(104,184,55, 0.90)",
      },
      {
        offset: [95, 40],
        symbolSize: 40,
        opacity: 0.7,
        color: "rgba(104,184,55, 0.90)",
      },
      {
        offset: [0, 35],
        symbolSize: 40,
        opacity: 0.68,
        color: "rgba(104,184,55, 0.85)",
      },
      {
        offset: [75, 45],
        symbolSize: 60,
        opacity: 0.7,
        color: "rgba(104,184,55, 0.80)",
      },
      {
        offset: [35, 78],
        symbolSize: 80,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [15, 20],
        symbolSize: 45,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [70, 75],
        symbolSize: 70,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [53, 90],
        symbolSize: 40,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [60, 20],
        symbolSize: 55,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [5, 75],
        symbolSize: 50,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [95, 15],
        symbolSize: 45,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [95, 85],
        symbolSize: 30,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
      {
        offset: [90, 62],
        symbolSize: 35,
        opacity: 0.88,
        color: "rgba(104,184,55, 0.95)",
      },
    ];
    let datas = [];
    var scale = 1;
    reSize(plantCap, datalist);
    function reSize(listSy, dataList) {
      //通过值来改变球的大小
      var maxArr = [];
      listSy.forEach(function (item) {
        maxArr.push(item.pti);
      });
      var strMax = maxArr.sort(function (a, b) {
        return b - a;
      });
      var maxNum = strMax[0]; //获取最大值
      dataList.forEach(function (item, index) {
        var pti = 0;
        item.symbolSize = (listSy[index].pti / maxNum) * 100;
        if (item.symbolSize < 50) {
          item.symbolSize = 50;
        }
        if (item.symbolSize > 80) {
          item.symbolSize = 80;
        }
      });
    }

    for (let i = 0; i < plantCap.length; i++) {
      let item = plantCap[i];
      let itemToStyle = datalist[i];
      item.pti = Number(item.pti).toFixed(2);
      datas.push({
        name: item.pti + "\n" + item.lineName,
        value: itemToStyle.offset,
        symbolSize: itemToStyle.symbolSize * scale,
        // symbolSize: itemToStyle.symbolSize,
        label: {
          normal: {
            textStyle: {
              fontSize: 14,
              color: "#fff",
            },
          },
        },
        itemStyle: {
          normal: {
            color: itemToStyle.color,
            opacity: itemToStyle.opacity,
          },
        },
      });
    }
    option = {
      tooltip: {
        formatter: "{b}",
      },
      grid: {
        show: false,
        top: 10,
        bottom: 0,
      },
      xAxis: [
        {
          gridIndex: 0,
          type: "value",
          show: false,
          min: 0,
          max: 100,
          nameLocation: "middle",
          nameGap: 5,
        },
      ],
      yAxis: [
        {
          gridIndex: 0,
          min: 0,
          show: false,
          max: 100,
          nameLocation: "middle",
          nameGap: 30,
        },
      ],
      series: [
        {
          type: "scatter",
          symbol: "circle",
          symbolSize: 120,
          label: {
            normal: {
              show: true,
              formatter: "{b}",
              color: "#fff",
              textStyle: {
                fontSize: "20",
              },
            },
          },
          itemStyle: {
            normal: {
              borderWidth: "4",
              borderType: "solid",
              borderColor: "#fff",
              color: "#68b837",
              shadowColor: "#68b837",
              shadowBlur: 10,
            },
          },
          data: datas,
        },
      ],
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}
// 线路平均运距图表
// lineChart();
function lineChart() {
  // let myChart = echarts.init(document.getElementById("line_chart"));
  let lineC = document.getElementsByClassName("line_chart");
  for (var i = 0; i < lineC.length; i++) {
    let myChart = echarts.init(lineC[i]);
    let index = 0;
    let colorList = ["#f36c6c", "#e6cf4e", "#20d180", "#0093ff"];
    option = {
      // title: {
      //   show: Object.keys(totalAvglineData).length === 0,
      //   text: "暂无数据",
      //   x: "center",
      //   y: "center",
      //   textStyle: {
      //     color: "#fff",
      //     fontWeight: "normal",
      //     fontSize: 16,
      //   },
      // },
      tooltip: {
        trigger: "axis",
        axisPointer: {
          type: "shadow",
        },
      },
      legend: {
        show: false,
      },
      grid: {
        left: 100,
        right: 30,
        top: 10,
        bottom: 10,
      },
      xAxis: {
        type: "value",

        splitLine: {
          show: false,
        },
        axisLabel: {
          show: false,
        },
        axisTick: {
          show: false,
        },
        axisLine: {
          show: false,
        },
      },
      yAxis: {
        type: "category",
        inverse: true,
        axisLine: {
          show: false,
        },
        axisTick: {
          show: false,
        },
        axisPointer: {
          label: {
            show: true,
            margin: 18,
          },
        },
        data: dataListlineID,
        axisLabel: {
          margin: 90,
          fontSize: 12,
          interval: 0,
          align: "left",
          color: "#fff",
          rich: {
            a1: {
              color: "#fff",
              backgroundColor: colorList[0],
              width: 14,
              height: 14,
              align: "center",
              borderRadius: 2,
            },
            a2: {
              color: "#fff",
              backgroundColor: colorList[1],
              width: 14,
              height: 14,
              align: "center",
              borderRadius: 2,
            },
            a3: {
              color: "#fff",
              backgroundColor: colorList[2],
              width: 14,
              height: 14,
              align: "center",
              borderRadius: 2,
            },
            b: {
              color: "#fff",
              backgroundColor: colorList[3],
              width: 14,
              height: 14,
              align: "center",
              borderRadius: 2,
            },
          },
          formatter: function (params) {
            if (index == 16) {
              index = 0;
            }
            index++;
            if (index - 1 < 3) {
              return ["{a" + index + "|" + index + "}" + "  " + params].join(
                "\n"
              );
            } else {
              return ["{b|" + index + "}" + "  " + params].join("\n");
            }
          },
        },
      },
      series: [
        {
          z: 2,
          name: "value",
          type: "bar",
          data: dataListavgline.map((item, i) => {
            itemStyle = {
              color: i > 3 ? colorList[3] : colorList[i],
            };
            return {
              value: item,
              itemStyle: itemStyle,
            };
          }),
          label: {
            show: true,
            position: "right",
            color: "#fff",
            fontSize: 14,
            offset: [10, 0],
          },
        },
      ],
    };
    myChart.setOption(option);
  }
}

// 五分钟延误事件频次
// yanwuChart();
function yanwuChart() {
  // var myChart = echarts.init(document.getElementById("yanwu_chart"));
  let yanwuC = document.getElementsByClassName("yanwu_chart");
  for (var i = 0; i < yanwuC.length; i++) {
    let myChart = echarts.init(yanwuC[i]);
    option = {
      color: ["#1C86F1"],
      legend: {
        textStyle: {
          color: "#eeeeee",
        },
        right: 37,
        top: 22,
      },
      grid: {
        left: "10%",
        right: "2%",
        top: "12%",
        bottom: "13%",
      },
      tooltip: {},
      xAxis: {
        type: "category",
        data: dataListlnNm,
        axisLine: {
          lineStyle: {
            color: "#657CA8",
          },
        },
        axisTick: {
          show: false,
        },
        axisLabel: {
          color: "#fff",
          rotate: 45,
          interval: 0,
          fontSize: 10,
        },
      },
      yAxis: {
        type: "value",
        name: "万车公里/件",
        nameTextStyle: {
          fontSize: 10,
        },
        axisLine: {
          lineStyle: {
            color: "#fff",
          },
        },
        axisTick: {
          show: false,
        },
        splitLine: {
          show: false,
        },
        axisLabel: {
          color: "#fff",
          fontSize: 12,
        },
      },
      series: [
        {
          type: "bar",
          barWidth: "70%",
          data: dataListkm,
          label: {
            show: false,
            position: "top",
            textStyle: {
              color: "#ffffff",
            },
          },
        },
      ],
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}

// 票务收入变化趋势图
// changeChart();
function changeChart() {
  let changeC = document.getElementsByClassName("changeChart");
  for (var i = 0; i < changeC.length; i++) {
    let myChart = echarts.init(changeC[i]);
    let color = [
      "#0090FF",
      "#36CE9E",
      "#FFC005",
      "#FF515A",
      "#8B5CFF",
      "#00CA69",
    ];
    let xAxisData = echartData.map((v) => thatDae(v.dtaTm));
    let yAxisData2 = echartData.map((v) => (v.rvn / 10000).toFixed(2));
    const hexToRgba = (hex, opacity) => {
      let rgbaColor = "";
      let reg = /^#[\da-f]{6}$/i;
      if (reg.test(hex)) {
        rgbaColor = `rgba(${parseInt("0x" + hex.slice(1, 3))},${parseInt(
          "0x" + hex.slice(3, 5)
        )},${parseInt("0x" + hex.slice(5, 7))},${opacity})`;
      }
      return rgbaColor;
    };

    option = {
      color: color,
      tooltip: {
        trigger: "axis",
        formatter: function (params) {
          let html = "";
          params.forEach((v) => {
            html += `<div style="color: #666;font-size: 14px;line-height: 24px">
                      <span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${
                        color[v.componentIndex]
                      };"></span>
                      ${v.seriesName}.${v.name}
                      <span style="color:${
                        color[v.componentIndex]
                      };font-weight:700;font-size: 18px">${v.value}</span>
                      万元`;
          });

          return html;
        },
        extraCssText:
          "background: #fff; border-radius: 0;box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);color: #333;",
        axisPointer: {
          type: "shadow",
          shadowStyle: {
            color: "#ffffff",
            shadowColor: "rgba(225,225,225,1)",
            shadowBlur: 5,
          },
        },
      },
      grid: {
        left: "2%",
        top: "20%",
        right: "6%",
        bottom: "5%",
        containLabel: true,
      },
      xAxis: [
        {
          type: "category",
          boundaryGap: false,
          axisLabel: {
            //formatter: '{value}月',
            interval: 0,
            rotate: 40,
            textStyle: {
              color: "#fff",
              fontSize: 12,
            },
            margin: 15,
          },
          axisLine: {
            lineStyle: {
              color: "#D9D9D9",
            },
          },
          data: xAxisData,
        },
      ],
      yAxis: [
        {
          type: "value",
          name: "单位：万元",
          axisLabel: {
            textStyle: {
              color: "#fff",
              fontSize: 12,
            },
          },
          nameTextStyle: {
            color: "#fff",
            fontSize: 12,
            lineHeight: 40,
          },
          splitLine: {
            lineStyle: {
              type: "dashed",
              color: "#E9E9E9",
            },
          },
          axisLine: {
            show: false,
          },
          axisTick: {
            show: false,
          },
        },
      ],
      series: [
        {
          name: "2020",
          type: "line",
          smooth: true,
          // showSymbol: false,
          symbolSize: 8,
          zlevel: 3,
          lineStyle: {
            normal: {
              color: color[1],
              shadowBlur: 3,
              shadowColor: hexToRgba(color[1], 0.5),
              shadowOffsetY: 8,
            },
          },
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(
                0,
                0,
                0,
                1,
                [
                  {
                    offset: 0,
                    color: hexToRgba(color[1], 0.3),
                  },
                  {
                    offset: 1,
                    color: hexToRgba(color[1], 0.1),
                  },
                ],
                false
              ),
              shadowColor: hexToRgba(color[1], 0.1),
              shadowBlur: 10,
            },
          },
          data: yAxisData2,
        },
      ],
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}

// 施工兑现率图表
// shigongDChart();
function shigongDChart() {
  let shigongDC = document.getElementsByClassName("shigongDChart");
  for (var i = 0; i < shigongDC.length; i++) {
    let myChart = echarts.init(shigongDC[i]);
    var colors = ["#2E9AFE", "#FF8000", "#A4A4A4", "#F7D358"],
      option = {
        color: colors,
        tooltip: {
          trigger: "axis",
          formatter: function (params) {
            var res = params[0].name;
            for (let i = 0; i < params.length; i++) {
              const element = params[i];
              res +=
                "<br/><div style='width: 10px;height: 10px;border-radius: 50%;background: " +
                colors[i] +
                ";display: inline-block'></div> " +
                element.seriesName +
                ": " +
                element.value +
                "%";
            }
            return res;
          },
        },
        legend: {
          data: majorSet,
          top: "92%",
          textStyle: {
            color: "#fff",
            fontSize: 12,
          },
        },
        grid: {
          top: "8%",
          left: "3%",
          right: "4%",
          bottom: "10%",
          containLabel: true,
        },
        yAxis: [
          {
            name: "",
            type: "value",
            max: 100, //设置最大值
            min: 0, //最小值
            splitNumber: 11, //11个刻度线，也就是10等分
            axisLabel: {
              show: true,
              interval: "auto",
              formatter: "{value}.00 %",
              color: "#fff",
              fontSize: 12,
            },
            show: true,
            axisLine: { show: false },
          },
        ],
        xAxis: [
          {
            type: "category",
            data: mthSet,
            axisLabel: {
              color: "#fff",
              fontSize: 12,
              margin: 15,
              rotate: 45,
            },
            axisLine: {
              lineStyle: {
                color: "#CCCCCC",
              },
            },
          },
        ],
        series: [
          {
            name: majorSet[0],
            type: "line",
            barWidth: "20px",
            data: statn_data,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSet[1],
            type: "line",
            barWidth: "20px",
            data: resv_data,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSet[2],
            type: "line",
            barWidth: "20px",
            data: pak_data,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSet[3],
            type: "line",
            barWidth: "20px",
            data: trk_data,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
        ],
      };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}

// 施工计划工时利用率
// shigongPChart();
function shigongPChart() {
  // var myChart = echarts.init(document.getElementById("shigongPChart"));
  let shigongPC = document.getElementsByClassName("shigongPChart");
  for (var i = 0; i < shigongPC.length; i++) {
    let myChart = echarts.init(shigongPC[i]);
    var colors = ["#2E9AFE", "#FF8000", "#A4A4A4", "#F7D358"],
      option = {
        color: colors,
        tooltip: {
          trigger: "axis",
          formatter: function (params) {
            var res = params[0].name;
            for (let i = 0; i < params.length; i++) {
              const element = params[i];
              res +=
                "<br/><div style='width: 10px;height: 10px;border-radius: 50%;background: " +
                colors[i] +
                ";display: inline-block'></div> " +
                element.seriesName +
                ": " +
                element.value +
                "%";
            }
            return res;
          },
        },
        legend: {
          data: majorSetU,
          top: "92%",
          textStyle: {
            color: "#fff",
            fontSize: 12,
          },
        },
        grid: {
          top: "8%",
          left: "3%",
          right: "4%",
          bottom: "10%",
          containLabel: true,
        },
        yAxis: [
          {
            name: "",
            type: "value",
            max: 100, //设置最大值
            min: 0, //最小值
            splitNumber: 11, //11个刻度线，也就是10等分
            axisLabel: {
              show: true,
              interval: "auto",
              formatter: "{value}.00 %",
              color: "#fff",
              fontSize: 12,
            },
            show: true,
            axisLine: { show: false },
          },
        ],
        xAxis: [
          {
            type: "category",
            data: mthSetU,
            axisLabel: {
              color: "#fff",
              fontSize: 12,
              margin: 15,
              rotate: 45,
            },
            axisLine: {
              lineStyle: {
                color: "#CCCCCC",
              },
            },
          },
        ],
        series: [
          {
            name: majorSetU[0],
            type: "line",
            barWidth: "20px",
            data: statn_dataU,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSetU[1],
            type: "line",
            barWidth: "20px",
            data: resv_dataU,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSetU[2],
            type: "line",
            barWidth: "20px",
            data: pak_dataU,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSetU[3],
            type: "line",
            barWidth: "20px",
            data: trk_dataU,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
        ],
      };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}

// 施工变更率图表
// shigongCChart();
function shigongCChart() {
  let shigongCC = document.getElementsByClassName("shigongCChart");
  for (var i = 0; i < shigongCC.length; i++) {
    let myChart = echarts.init(shigongCC[i]);
    var colors = ["#2E9AFE", "#FF8000", "#A4A4A4", "#F7D358"],
      option = {
        color: colors,
        tooltip: {
          trigger: "axis",
          formatter: function (params) {
            var res = params[0].name;
            for (let i = 0; i < params.length; i++) {
              const element = params[i];
              res +=
                "<br/><div style='width: 10px;height: 10px;border-radius: 50%;background: " +
                colors[i] +
                ";display: inline-block'></div> " +
                element.seriesName +
                ": " +
                element.value +
                "%";
            }
            return res;
          },
        },
        legend: {
          data: majorSetC,
          top: "92%",
          textStyle: {
            color: "#fff",
            fontSize: 12,
          },
        },
        grid: {
          top: "8%",
          left: "3%",
          right: "4%",
          bottom: "10%",
          containLabel: true,
        },
        yAxis: [
          {
            name: "",
            type: "value",
            max: 4, //设置最大值
            min: 0, //最小值
            // splitNumber: 10,
            // boundaryGap:[0,1],
            axisLabel: {
              show: true,
              interval: "auto",
              formatter: "{value}%",
              color: "#fff",
              fontSize: 12,
            },
            // show: true,
            axisLine: { show: false },
          },
        ],
        xAxis: [
          {
            type: "category",
            data: mthSetC,
            axisLabel: {
              color: "#fff",
              fontSize: 12,
              margin: 15,
            },
            axisLine: {
              lineStyle: {
                color: "#CCCCCC",
              },
            },
          },
        ],
        series: [
          {
            name: majorSetC[0],
            type: "line",
            barWidth: "20px",
            data: resv_dataC,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSetC[1],
            type: "line",
            barWidth: "20px",
            data: pak_dataC,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSetC[2],
            type: "line",
            barWidth: "20px",
            data: statn_dataC,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
          {
            name: majorSetC[3],
            type: "line",
            barWidth: "20px",
            data: trk_dataC,
            lineStyle: {
              normal: {
                width: 4,
              },
            },
          },
        ],
      };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}

// 进度完成情况
function jinduChart() {
  // var myChart = echarts.init(document.getElementById("jinduChart"));
  let jinduC = document.getElementsByClassName("jinduChart");
  for (var i = 0; i < jinduC.length; i++) {
    let myChart = echarts.init(jinduC[i]);
    var chartData = [0.82, 1.0, 0.5, 6.72];
    var chartData2 = [0.82, 1.01, 0.5375, 7.7];
    var chartData3 = [1.01, 1.01, 1.08, 1.15];
    option = {
      tooltip: {
        trigger: "axis",
        axisPointer: {
          type: "shadow",
          label: {
            show: true,
          },
        },
      },
      grid: {
        left: "13%",
        top: "10%",
        right: "13%",
        bottom: "20%",
      },
      legend: {
        data: ["计划量", "完成量", "完成率"],
        top: "92%",
        textStyle: {
          color: "#fff",
          fontSize: 12,
        },
      },
      xAxis: {
        data: planPercentindxNmDtl,
        axisLine: {
          show: true, //隐藏X轴轴线
          lineStyle: {
            color: "#A1A1A1",
            width: 1,
          },
        },
        axisTick: {
          show: true, //隐藏X轴刻度
          alignWithLabel: true,
        },
        axisLabel: {
          show: true,
          textStyle: {
            color: "#fff", //X轴文字颜色
            fontSize: 12,
          },
          margin: 10,
          interval: 0,
          rotate: 0,
        },
      },
      yAxis: [
        {
          type: "value",
          name: "",
          nameTextStyle: {
            color: "#A1A1A1",
            fontSize: 12,
          },
          splitLine: {
            show: true,
            lineStyle: {
              width: 2,
              color: "#A1A1A1",
            },
          },
          axisTick: {
            show: false,
          },
          axisLine: {
            show: false,
          },
          axisLabel: {
            show: true,
            textStyle: {
              color: "#fff",
              fontSize: 12,
            },
            formatter: function (value, index) {
              return value.toFixed(2);
            },
          },
        },
        {
          type: "value",
          name: "",
          nameTextStyle: {
            color: "#A1A1A1",
            fontSize: 12,
          },
          position: "right",
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false,
          },
          axisLine: {
            show: false,
            lineStyle: {
              color: "#A1A1A1",
              width: 2,
            },
          },
          axisLabel: {
            show: true,
            formatter: function (value, index) {
              return value.toFixed(2);
            },
            textStyle: {
              color: "#fff",
              fontSize: 12,
            },
          },
        },
      ],
      series: [
        {
          name: "计划量",
          type: "bar",
          barWidth: "35%",
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                {
                  offset: 0,
                  color: "#5B9BD5",
                },
                {
                  offset: 1,
                  color: "#5B9BD5",
                },
              ]),
            },
          },
          data: planPercentindxindxVl1,
        },
        {
          name: "完成量",
          type: "bar",
          barWidth: "35%",
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                {
                  offset: 0,
                  color: "#ED7D31",
                },
                {
                  offset: 1,
                  color: "#ED7D31",
                },
              ]),
            },
          },
          data: planPercentindxVl2,
        },
        {
          name: "完成率",
          type: "line",
          yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
          showAllSymbol: true, //显示所有图形。
          symbol: "circle", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          itemStyle: {
            //折线拐点标志的样式
            color: "#26D9FF",
            borderColor: "#A1A1A1",
            width: 2,
            shadowColor: "#A1A1A1",
            shadowBlur: 2,
          },
          lineStyle: {
            color: "#A1A1A1",
            width: 2,
            shadowBlur: 2,
          },
          data: planPercentindxVl4,
        },
      ],
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}

// 质量检查完成情况
// zhiliangChart();
function zhiliangChart() {
  // 基于准备好的dom，初始化echarts实例
  // var myChart = echarts.init(document.getElementById("zhiliangChart"));
  let zhiliangC = document.getElementsByClassName("zhiliangChart");
  for (var i = 0; i < zhiliangC.length; i++) {
    let myChart = echarts.init(zhiliangC[i]);
    var chartData = [24, 24, 24, 24];
    var chartData2 = [40, 50, 48, 65];
    var chartData3 = [83, 104, 100, 104];
    option = {
      backgroundColor: "",
      tooltip: {
        trigger: "axis",
        axisPointer: {
          type: "shadow",
          label: {
            show: true,
          },
        },
      },
      grid: {
        left: "10%",
        top: "10%",
        right: "15%",
        bottom: "20%",
      },
      legend: {
        data: ["计划完成量", "实际完成量", "指标值"],
        top: "92%",
        textStyle: {
          color: "#fff",
          fontSize: 12,
        },
      },
      xAxis: {
        data: ["10号线二期", "14号线", "15号线", "18号线"],
        axisLine: {
          show: true, //隐藏X轴轴线
          lineStyle: {
            color: "#A1A1A1",
            width: 1,
          },
        },
        axisTick: {
          show: true, //隐藏X轴刻度
          alignWithLabel: true,
        },
        axisLabel: {
          show: true,
          textStyle: {
            color: "#fff", //X轴文字颜色
            fontSize: 12,
          },
          interval: 0,
          rotate: 0,
          margin: 10,
        },
      },
      yAxis: [
        {
          type: "value",
          name: "",
          nameTextStyle: {
            color: "#A1A1A1",
            fontSize: 12,
          },
          splitLine: {
            show: true,
            lineStyle: {
              width: 2,
              color: "#A1A1A1",
            },
          },
          axisTick: {
            show: false,
          },
          axisLine: {
            show: false,
          },
          axisLabel: {
            show: true,
            textStyle: {
              color: "#fff",
              fontSize: 12,
            },
          },
        },
        {
          type: "value",
          name: "",
          nameTextStyle: {
            color: "#A1A1A1",
            fontSize: 12,
          },
          position: "right",
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false,
          },
          axisLine: {
            show: false,
            lineStyle: {
              color: "#A1A1A1",
              width: 2,
            },
          },
          axisLabel: {
            show: true,
            formatter: "{value} %", //右侧Y轴文字显示
            textStyle: {
              color: "#fff",
              fontSize: 12,
            },
          },
        },
      ],
      series: [
        {
          name: "计划完成量",
          type: "bar",
          barWidth: "35%",
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                {
                  offset: 0,
                  color: "#5B9BD5",
                },
                {
                  offset: 1,
                  color: "#5B9BD5",
                },
              ]),
            },
          },
          data: chartData,
        },
        {
          name: "实际完成量",
          type: "bar",
          barWidth: "35%",
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                {
                  offset: 0,
                  color: "#ED7D31",
                },
                {
                  offset: 1,
                  color: "#ED7D31",
                },
              ]),
            },
          },
          data: chartData2,
        },
        {
          name: "指标值",
          type: "line",
          yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
          showAllSymbol: true, //显示所有图形。
          symbol: "circle", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          itemStyle: {
            //折线拐点标志的样式
            color: "#26D9FF",
            borderColor: "#A1A1A1",
            width: 2,
            shadowColor: "#A1A1A1",
            shadowBlur: 2,
          },
          lineStyle: {
            color: "#A1A1A1",
            width: 2,
            shadowBlur: 2,
          },
          data: chartData3,
        },
      ],
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}

// 投资完成率
// touziChart();
function touziChart() {
  // var myChart = echarts.init(document.getElementById("touziChart"));
  let touziC = document.getElementsByClassName("touziChart");
  for (var i = 0; i < touziC.length; i++) {
    let myChart = echarts.init(touziC[i]);
    var fourPieData = [
      {
        name: "10号线二期",
        max: 100,
        value: 64.87,
      },
      {
        name: "14号线",
        max: 100,
        value: 50.4,
      },
      {
        name: "15号线",
        max: 100,
        value: 57.66,
      },
      {
        name: "18号线",
        max: 100,
        value: 64.89,
      },
    ];

    var titleArr = [],
      seriesArr = [];
    colors = [
      ["#57bbf7", "#f4f4f7"],
      ["#ffc969", "#f4f4f7"],
      ["#f38b97", "#f4f4f7"],
      ["#b1d882", "#f4f4f7"],
      ["#c0acf9", "#f4f4f7"],
    ];
    fourPieData.forEach(function (item, index) {
      titleArr.push({
        text: item.name,
        left: index < 2 ? index * 50 + 15 + "%" : index * 50 - 65 + "%",
        top: index < 2 ? "40%" : "90%",
        textAlign: "center",
        textStyle: {
          fontWeight: "normal",
          fontSize: "12",
          color: colors[index][0],
          textAlign: "center",
        },
      });
      seriesArr.push({
        name: item.name,
        type: "pie",
        clockWise: false,
        radius: [30, 38],
        itemStyle: {
          normal: {
            color: colors[index][0],
            shadowColor: colors[index][0],
            shadowBlur: 0,
            label: {
              show: false,
            },
            labelLine: {
              show: false,
            },
          },
        },
        hoverAnimation: false,
        center: [
          index < 2 ? index * 50 + 15 + "%" : index * 50 - 65 + "%",
          index < 2 ? "22%" : "72%",
        ],
        data: [
          {
            value: item.value,
            label: {
              normal: {
                formatter: function (params) {
                  return params.value + "%";
                },
                position: "center",
                show: true,
                textStyle: {
                  fontSize: "14",
                  fontWeight: "bold",
                  color: colors[index][0], //跟随其他颜色
                },
              },
            },
          },
          {
            value: item.max - item.value,
            name: "invisible",
            itemStyle: {
              normal: {
                color: colors[index][1],
              },
              emphasis: {
                color: colors[index][1],
              },
            },
          },
        ],
      });
    });
    var option = {
      title: titleArr,
      series: seriesArr,
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
}
